<script src="${ctx}/extends/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx}/workflowStatic/js/javacode/codemirror.js"></script>
<script type="text/javascript" src="${ctx}/workflowStatic/js/javacode/InitMirror.js"></script>
<script type="text/javascript" src="${ctx}/workflowStatic/js/commonScript.js"></script>
<script type="text/javascript" src="${ctx}/workflowStatic/js/flowVars.js"></script>
<title>流程定义管理</title>
<div>
    <div class="allRight">
        <div class="right_table" style="float: right;background-color: #fff">
            <table class="layui-table" lay-filter="bpmNodeRuleList" id="bpmNodeRuleList" style="margin: 0;"></table>
        </div>
    </div>
    <div style="display: inline-block; padding-left: 10px;width: 78%">
        <form class="layui-form" lay-filter="bpmNodeRuleForm" id="bpmNodeRuleForm">
             <div style="height: 452px;overflow: auto;">
                <table class="layui-table">
                    <tr>
                        <th>当前节点名称：</th>
                        <td>${nodeName}</td>
                    </tr>
                    <tr>
                        <th>后续节点：</th>
                        <td>
                            <#list nextNodes as node>
                                ${node.nodeName} (${node.nodeId})
                                <#sep>,</#sep>
                            </#list>
                        </td>
                    </tr>
                    <tr>
                        <th>当规则不符合时是否正常跳转：</th>
                        <td>
                            <div class="layui-form-item" style="margin-bottom: 10px;">
                                <input type="checkbox" class="layui-input" lay-filter="isJumpForDef" <#if bpmNodeSet.isJumpForDef == 1>checked</#if> name="isJumpForDef" lay-skin="primary">
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <th>规则名称：</th>
                        <td>
                            <div class="layui-form-item" style="margin: 0;">
                                <input type="text" id="ruleName" name="ruleName" lay-verify="required" class="layui-input" value="${bpmNodeRule.ruleName}">
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <th>规则表达式：<span class="required">*</span></th>
                        <td>
                            <div>
                                <span class="commonScript" style="cursor: pointer;">
                                    <i class="layui-icon layui-icon-fonts-code"></i>常用脚本
                                </span>
                                &nbsp;
                                表单变量:
                                <div style="display: inline-block; width: 140px;" >
                                    <select name="flowVars" lay-filter="flowVars" class="flowVars">
                                        <option value="">请选择</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item" style="margin: 0;">
                                <textarea id="conditionCode" codemirror="true" name="conditionCode" class="layui-textarea">return true;</textarea>
                            </div>
                            <div>这个脚本需要使用返回语句（return）返回布尔值，返回true流程将跳转到指定的节点。</div>
                        </td>
                    </tr>
                    <tr>
                        <th>跳转节点名称：</th>
                        <td>
                            <div class="layui-form-item" style="margin: 0;">
                                <select name="targetNode" lay-verify="required">
                                    <option value="">请选择</option>
                                    <#list activityList?keys as key>
                                            <#if (activityList[key]?size>0)>

                                                <optgroup label="${key}">
                                                    <#list activityList[key]?keys as optionKey>
                                                        <option value="${optionKey},${activityList[key][optionKey]}">${activityList[key][optionKey]}</option>
                                                    </#list>
                                            </#if>
                                        </optgroup>
                                    </#list>
                                </select>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <th>备注</th>
                        <td>
                            <div class="layui-form-item" style="margin: 0;">
                                <textarea id="memo" name="memo" class="layui-textarea">${bpmNodeRule.memo}</textarea>
                            </div>
                        </td>
                    </tr>
                </table>
                <input type="hidden" id="ruleId" name="ruleId" value="${bpmNodeRule.ruleId}" />
                <input type="hidden" name="priority" value="${bpmNodeRule.priority}" />
                <input type="hidden" name="procDefId" value="${bpmNodeRule.procDefId}" />
                <input type="hidden" name="nodeId" value="${bpmNodeRule.nodeId}" />
                <input type="hidden" id="modelId" name="modelId" value="${modelId}" />
                <input type="hidden" id="parentProcDefId" name="parentProcDefId" value="${parentProcDefId}"/>
            </div>
            <div class="layui-btn-container" style="width: 100%;position: absolute;bottom: 5px;text-align: center;">
                <a class="layui-btn layui-btn-md tool_btn" id="btnAdd" lay-event="add">
                    <i class="layui-icon"></i>
                    <span>增加</span>
                </a>
                <a class="layui-btn layui-btn-md tool_btn" lay-filter="save" lay-submit lay-event="save">
                    <i class="layui-icon"></i>
                    <span>保存</span>
                </a>
                <a class="layui-btn layui-btn-danger layui-btn-md tool_btn" lay-event="close" id="btnClose">
                    <i class="layui-icon"></i>
                    <span>关闭</span>
                </a>
            </div>
        </form>
    </div>

</div>
<style>
    .layui-layer-content{
        overflow: hidden !important;
    }
</style>
<script type="text/html" id="bar">
    <a class="iconfont iconlong-arrow-up" lay-event="up"></a>
    <a class="iconfont iconlong-arrow-down" lay-event="down"></a>
    <a class="iconfont iconguanbi " style="color: red" lay-event="del"></a>
</script>
<script>
    layui.use(['table', 'layer', 'jquery', 'form', 'commons','element', 'setter', 'totalFilter', 'common'], function () {
        var table = layui.table,
            layer = layui.layer,
            $ = layui.jquery,
            element = layui.element,
            setter = layui.setter,
            commons = layui.commons,
            form = layui.form;

        form.render();
        element.render();

        var nodeId = "${nodeId}";
        var procDefId = "${procDefId}";

        var url = serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeRule/getByProcDefIdNodeId";
        table.render({
            elem: "#bpmNodeRuleList"
            , cellMinWidth: 80
            , title: '流程跳转规则列表'
            , height: "500px"
            , url: url
            , where: {procDefId: procDefId, nodeId: nodeId}
            , method: 'post'
            , cols: [[
                {field:"ruleId", title: "ID", hide:true},
                {field:"ruleName", title: "规则名称",  width: 100, align:"center"}
                , { title: '管理', toolbar: '#bar', width: 100, align: 'center'}
            ]]

        });

        // 行尾工具按钮
        table.on('tool(bpmNodeRuleList)', function (obj) {

            var data = obj.data,
                event = obj.event;
            var thisTr = $(this).parents("tr");
            var thisTrDataIndex = thisTr.attr("data-index");
            switch (event) {
                case 'up':
                    var prevTr = $(thisTr).prev();
                    if(prevTr){
                        var prevDataIndex = prevTr.attr("data-index");
                        thisTr.insertBefore(prevTr);
                        thisTr.attr("data-index",prevDataIndex);
                        prevTr.attr("data-index",thisTrDataIndex);
                    }
                    table.render();
                    reSort();
                    break;
                case 'down':
                    var nextTr = $(thisTr).next();
                    var nextDataIndex = nextTr.attr("data-index");
                    if(nextTr){
                        thisTr.insertAfter(nextTr);
                        thisTr.attr("data-index",nextDataIndex);
                        nextTr.attr("data-index",thisTrDataIndex);
                    }
                    table.render();
                    reSort();
                    break;
                case 'del' :
                    layer.confirm("确认要删除该跳转规则吗？", {title: '删除确认'}, function (index) {
                        $.ajax({
                            url: serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeRule/del",
                            method: "post",
                            data: {ruleId:data.ruleId},
                            dataType: "json",
                            success : function (result) {
                                layer.alert(result.msg);
                                table.reload('bpmNodeRuleList');
                            }
                        });
                    });
                    break;
            }
        });

        // 行事件监听
        table.on('row(bpmNodeRuleList)', function (obj) {
            var data = obj.data;
            $.ajax({
                url: serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeRule/getById",
                method: "get",
                data: {ruleId:data.ruleId},
                dataType: "json",
                success: function (result) {
                    var data = result.data;
                    setFormByJson(data);
                    var tmp=data.targetNode +"," + data.targetNodeName;
                    $("select[name='targetNode']").val(tmp);
                    InitMirror.editor.setCode(document.getElementById("conditionCode").value);
                    form.render();
                }
            });

        });

        form.on('submit(save)', function () {
            InitMirror.editor.save();
            $.ajax({
                url: serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeRule/save",
                method:"post",
                data: $("#bpmNodeRuleForm").serialize(),
                dataType:"json",
                success: function (result) {
                    if (commons._filterRecord(result)) {
                        layer.alert(result.msg);
                        table.reload('bpmNodeRuleList');
                        layer.closeAll('page'); //关闭所有页面层
                    }else {
                        layer.alert(result.msg);
                    }
                }

            });
        });

        $(document).on("click", "#btnAdd", function () {
            $("#ruleId").val("");
            $("#memo").val("");
            $("#ruleName").val("");
            InitMirror.editor.setCode("return true;");
        });

        $(document).on("click", "#btnClose", function () {
            // var thisIframeIndex = window.parent.layer.getFrameIndex(window.name);
            // window.parent.layer.close(thisIframeIndex);
            layer.closeAll('page'); //关闭所有页面层
        });

        form.on('select(flowVars)',function (data) {
            var value = data.value;
            InitMirror.editor.insertCode(value);
        });

        form.on('checkbox(isJumpForDef)', function (data) {
            var checked = data.elem.checked;
            $.ajax({
                method: "post",
                url: serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeRule/updateIsJumpForDef",
                data: {nodeId: nodeId, procDefId: procDefId, isJumpForDef: checked?1:0},
                dataType: "json",
                success: function (result) {

                }
            });
        });
        
        function reSort() {

            var ruleIds = "";
            $("td[data-field='ruleId'] div").each(function (index, item) {

                var ruleId = item.innerHTML;
                ruleIds += ruleId + ",";

            });

            if (ruleIds != null) {
                ruleIds = ruleIds.substring(0, ruleIds.length - 1);
            }

            $.ajax({
                method: "post",
                url: serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeRule/sortRule",
                data: {ruleIds: ruleIds},
                dataType: "json",
                success: function () {

                }
            });

        }

        function setFormByJson(data) {
            var json = data;
            if (typeof (data) == "string") {
                json = jQuery.parseJSON(data);
            }

            for ( var p in json) {

                var value = json[p];
                var frmElments = $("input[name='" + p+ "'],textarea[name='" + p + "']");
                if (frmElments[0]) {
                    frmElments.val(value);
                }
            }
        }

    });
</script>